<template>
  <div>
    <FormPanel ref="form" :cols="3" :list="formList" :labelWidth="90" :isSubmitBtn="false" @formChange="formChangeHandle"></FormPanel>

    <div class="confirm-button-style">
      <AjaxButton v-show="type != 'detailed'" :click="saveDialog" type="primary">保 存</AjaxButton>
      <el-button type="primary" @click="closeDialog">取 消</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import AjaxButton from '@/components/AjaxButton';
import { getVehicle, addSave, editSave, queryCaseDetailed } from '@/api/repair/repairExample/repairCaseUpload/index';
import { VIN } from '@/utils/validate'; // 校验js引入
import { jsonToHump } from '@/utils/index'; // 驼峰引用
import _ from 'lodash'; // 拷贝引用

export default {
  name: 'repairCasedAdd',
  mixins: [dictionary],
  props: ['rowData', 'type'],
  data() {
    this.saveData = null;
    return {
      formList: this.createFormList(),
      // biandId: '', //品牌
      ID: 0, // id的值
      VIN: '', // 车辆vin
      vehicleClass: '', // 车辆大类
      vehicleState: '', // 车辆状况
      troubleName: '', // 故障类型名称
      brandCode: '', // 品牌ID
      seriesCode: '', // 车系ID
      modelCode: '', // 车型id
      list: {} // 定义接收查询结果
    };
  },
  created() {
    console.log(this.rowData, '333');
    // 判断是编辑或者是明细
    if (this.type != 'add') {
      // 显示隐藏的审核列表
      this.formList.find(item => item.fieldName === 'auditor').hidden = false;
      this.formList.find(item => item.fieldName === 'auditDate').hidden = false;
      this.formList.find(item => item.fieldName === 'auditOpinion').hidden = false;

      if (this.type == 'edit') {
        this.ID = this.rowData.id;
        this.queryDetailed(this.ID);

        this.formList.find(item => item.fieldName === 'mileage').disabled = false;
        this.formList.find(item => item.fieldName === 'roTroubleDesc').disabled = false;
        this.formList.find(item => item.fieldName === 'troubleCause').disabled = false;
        this.formList.find(item => item.fieldName === 'remark').disabled = false;
      } else {
        // 赋值操作
        this.formList.forEach(x => {
          x.initialValue = this.rowData[x.fieldName];
        });
        this.formList.forEach(x => {
          x.disabled = true;
        });
      }
    }

    console.log('传参', this.rowData);
  },
  methods: {
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '案例标题',
          fieldName: 'exampleTitle'
        },
        {
          type: 'INPUT',
          label: '品牌',
          fieldName: 'brandName',
          disabled: true,
          filterable: true,
          rules: [{ required: true, message: '(品牌)项必须输入,请输入', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '车系',
          fieldName: 'seriesName',
          filterable: true,
          disabled: true,
          rules: [{ required: true, message: '(车系)项必须输入,请输入', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '单据状态',
          fieldName: 'status',
          disabled: true,
          initialValue: 67011001,
          itemList: this.createDictList('6701')
        },
        {
          type: 'INPUT',
          label: 'VIN码',
          fieldName: 'vin',
          maxlength: 17,
          onEnter: val => {
            this.VIN = val;
            this.queryVehicle();
          },
          rules: [
            { required: true, message: '(VIN码)项必须输入,请输入', trigger: 'blur' },
            { trigger: 'blur', validator: VIN }
          ]
        },
        {
          type: 'INPUT',
          label: '行驶里程',
          disabled: true,
          fieldName: 'mileage'
        },
        {
          type: 'SELECT',
          label: '故障类型',
          fieldName: 'troubleCode',
          itemList: this.createDictList('5177'),
          rules: [{ required: true, message: '(故障类型)项必须输入,请输入', trigger: 'blur' }],
          change: val => {
            this.faultType(val);
          }
        },
        {
          type: 'SELECT',
          label: '车辆状况',
          fieldName: 'vehicleStateCode',
          itemList: this.createDictList('9969'),
          rules: [{ required: true, message: '(车辆状况)项必须输入,请输入', trigger: 'blur' }],
          change: val => {
            this.vehicleStatus(val);
          }
        },
        {
          type: 'INPUT',
          label: '车型大类',
          fieldName: 'vehicleClassName',
          readonly: true
        },
        {
          type: 'TEXT_AREA',
          label: '故障现象',
          fieldName: 'roTroubleDesc',
          rows: 3,
          selfCols: 1.5
        },
        {
          type: 'TEXT_AREA',
          label: '故障诊断分析',
          fieldName: 'troubleCause',
          selfCols: 1.5,
          rows: 3
        },
        {
          type: 'INPUT',
          label: '备注',
          fieldName: 'remark',
          selfCols: 1.5
        },
        {
          type: 'INPUT',
          label: '审核人员',
          fieldName: 'auditor',
          hidden: true,
          selfCols: 1.5
        },
        {
          type: 'DATE',
          dateType: 'exactdate',
          label: '审核日期',
          fieldName: 'auditDate',
          hidden: true,
          selfCols: 1.5
        },
        {
          type: 'INPUT',
          label: '审核备注',
          fieldName: 'auditOpinion',
          hidden: true,
          selfCols: 1.5
        }
      ];
    },
    // 编辑页面查询
    async queryDetailed(val) {
      console.log(val, 'val');
      let res = await queryCaseDetailed(val);
      if (res.resultCode == 200) {
        this.list = _.cloneDeep(res.data[0]);
        jsonToHump(this.list);

        // 赋值操作
        this.formList.forEach(x => {
          x.initialValue = this.list[x.fieldName];
        });
        this.formList.forEach(x => {
          x.disabled = true;
        });
      }
    },

    // 查询车辆品牌,车系,车辆大类
    async queryVehicle() {
      console.log('是否进入方法', this.VIN);
      let params = { VIN: this.VIN };
      let res = await getVehicle(params);
      if (res.resultCode == 200) {
        this.formList.find(item => item.fieldName === 'brandName').initialValue = res.data[0].BRAND_NAME;
        this.brandCode = res.data[0].BRAND_ID;
        this.formList.find(item => item.fieldName === 'seriesName').initialValue = res.data[0].SERIES_NAME;
        this.seriesCode = res.data[0].SERIES_ID;
        this.formList.find(item => item.fieldName === 'vehicleClassName').initialValue = res.data[0].MODEL_NAME;
        this.modelCode = res.data[0].MODEL_ID;
        this.formList.find(item => item.fieldName === 'mileage').initialValue = res.data[0].MILEAGE;
      }
    },
    // 改变故障类型,改变故障类型名称的值
    faultType(val) {
      if (val == 51770001) {
        this.troubleName = '普通';
      } else if (val == 51770002) {
        this.troubleName = '复杂';
      } else if (val == 51770003) {
        this.troubleName = '特殊';
      }
    },
    // 改变车辆状况,改变车辆状况名称
    vehicleStatus(val) {
      if (val == 99690001) {
        this.vehicleState = '良好';
      } else if (val == 99690002) {
        this.vehicleState = '损坏';
      }
    },
    // 表单提交
    formChangeHandle(val) {
      console.log(val, 'val');
      this.saveData = val;
      console.log(this.saveData, 'saveData');
    },
    // 新增保存按钮操作
    async saveDialog() {
      this.saveData = null;
      this.$refs.form.SUBMIT_FORM();

      if (this.saveData != null) {
        let ref = this.saveData;
        let obj = {
          vehicleClassName: this.vehicleClass, // 车辆大类
          vehicleStateName: this.vehicleState, // 车辆状况
          troubleDesc: this.troubleName, // 故障类型名称
          brandCode: this.brandCode, // 品牌ID
          seriesCode: this.seriesCode, // 车系ID
          vehicleClassCode: this.modelCode, // 车型大类代码
          ...ref
        };
        console.log(obj, 'obj');
        console.log(this.type, 'type');

        if (this.type == 'add') {
          let res = await addSave(obj);
          if (res.resultCode == 200) {
            this.$notify.success({ title: '提示信息', message: '新增成功' });
            this.closeDialog('refresh');
          }
        } else if (this.type == 'edit') {
          let res = await editSave(obj, this.ID);
          if (res.resultCode == 200) {
            this.$notify.success({ title: '提示信息', message: '编辑成功' });
            this.closeDialog('refresh');
          }
        }
      } else {
        return this.$notify.warning({ title: '提示信息', message: '有校验信息未通过' });
      }
    },
    // 取消按钮关闭页面
    closeDialog(param) {
      console.log('点击关闭');
      this.$emit('close', false, param);
    }
  }
};
</script>

<style lang="less" scoped>
.confirm-button-style {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 9;
  border-top: 1px solid #e9e9e9;
  padding: 10px 20px;
  background: #fff;
  text-align: right;
}
</style>
